<template>
	<view class="box">
		<view class="top">
			<u--form labelPosition="left">
				<u-form-item label="收货人" labelAlign='center' labelWidth="169rpx" borderBottom>
					<u--input v-model="userInfo.name" border="none"></u--input>
				</u-form-item>
				<u-form-item label="手机号" labelWidth="169rpx" borderBottom>
					<u--input v-model="userInfo.phone" border="none"></u--input>
				</u-form-item>
				<u-form-item label="所在地址" labelWidth="169rpx" borderBottom>
					<u--input v-model="userInfo.path" border="none"></u--input>
				</u-form-item>
				<u-form-item label="详细地址" labelWidth="169rpx" borderBottom>
					<!-- <u--textarea v-model="userInfo.alladress" border="none" height="160rpx" placeholder="请输入内容">
				</u--textarea> -->
					<!-- <u--textarea v-model="userInfo.alladress" placeholder="请输入内容" ></u--textarea> -->
					<u--textarea v-model="userInfo.alladress" height='150' confirmType='none' placeholder="请输入内容" count>
					</u--textarea>
				</u-form-item>
			</u--form>
		</view>


		<view class="bottom">
			<view class="bot_1">
				<text>标签</text>
				<u-radio-group v-model="userInfo.radiovalue1" placement="row">
					<u-radio :customStyle="{marginBottom: '8px'}" v-for="(item, index) in radiolist1" :key="index"
						:label="item.name" :name="item.name" @change="radioChange">
					</u-radio>
				</u-radio-group>
			</view>

			<view class="bot_2">
				<view class="">
					<view class="bot_2_top">
						设置默认地址
					</view>
					<view class="">
						提醒 ：每次下单会默认推荐该地址
					</view>
				</view>
				<!-- 开关选择器 -->
				<u-switch v-model="userInfo.value" activeColor='#ff6040' @change="change"></u-switch>
			</view>

			<!-- 分割线 -->
			<u-divider></u-divider>

			<!-- 按钮 -->
			<u-button class='button' @click="addressadd" color='#ff6040'>{{button}}</u-button>
			<!-- <u-button v-else class='button' @click="addressadd" color='#ff6040'>{{button}}</u-button> -->
			<u-button @click="rest" text="重置"></u-button>

		</view>

	</view>
</template>

<script>
	// 用户  uid
	import user from '../../common/userinfo.js'
	// 引入封装好的地址
	import {
		Addressadd, //地址添加
		
	} from '../../request/app.js'
	export default {
		data() {
			return {
				show:false,
				id:'',
				button:'保存地址',
				radiolist1: [{
						name: '家',
						disabled: false
					},
					{
						name: '公司',
						disabled: false
					},
					{
						name: '学校',
						disabled: false
					}
				],
				userInfo: {
					name: '',
					phone: '',
					path: '',
					alladress: '', // 详细地址
					radiovalue1: '家', // 标签
					value: true // 控制 默认地址选择
				}
			}
		},
		methods: {
			//  标签选择
			radioChange(e) {
				console.log(e, '标签');
				this.userInfo.radiovalue1 = e
			},
			// 开关选择器
			change(e) {
				console.log(e, '开关选择器状态');
			},
			// 点击添加地址
			addressadd() {
				if (this.userInfo.name == '') {
					uni.showToast({
						title: '请输入姓名',
						icon: 'error'
					})
					return
				}
				if (this.userInfo.phone == '') {
					uni.showToast({
						title: '请输入手机号',
						icon: 'error'
					})
					return
				}
				if (this.userInfo.path == '') {
					uni.showToast({
						title: '请输入所在地',
						icon: 'error'
					})
					return
				}
				if (this.userInfo.alladress == '') {
					uni.showToast({
						title: '请输入详细地址',
						icon: 'error'
					})
					return
				}
				// 调用地址添加接口
				if(this.show){
					uni.setStorageSync('siteinfo',this.userInfo) 
					// console.log(uni.setStorageSync('siteinfo',this.userInfo) );
					this.show = false
					uni.navigateTo({
						url:'../addresslist/addresslist?id='+this.id
					})
				}else{
					Addressadd({
							uid: user.uid,
							username: this.userInfo.name,
							userphone: this.userInfo.phone,
							location: this.userInfo.path,
							useraddress: this.userInfo.alladress,
							status: this.userInfo.value ? 1 : 0,
							label: this.userInfo.radiovalue1
						})
						.then(res => {
							console.log(res, '地址添加信息');
							if (res.data.code == 200) {
								uni.navigateTo({
									url: '../addresslist/addresslist'
								})
							}
					
						})
				}
				
			},

			// 点击重置按钮
			rest() {
				this.userInfo = {
					name: '',
					phone: '',
					path: '',
					alladress: '',
					radiovalue1: '家',
					value: false
				}
			}
		},
		onLoad(opation) {
			
			console.log(opation, '回显');
			this.id = opation.id 
			let userAddress = uni.getStorageSync('siteinfo')
			console.log(userAddress);
			if (opation.id) {
				uni.setNavigationBarTitle({
					title:'修改地址'
				})
				// this.button = '修改地址'
				this.userInfo = {
					name: userAddress.username,
					phone: userAddress.userphone,
					path: userAddress.location,
					alladress: userAddress.useraddress, // 详细地址
					radiovalue1: userAddress.label, // 标签
					value: false // 控制 默认地址选择
				}
				this.show = true
				// uni.setStorageSync('siteinfo',this.userInfo)
				// 调用编辑接口
				// Addressedit({
				// 		id: opation.id,
				// 		username: userAddress.username,
				// 		userphone: userAddress.userphone,
				// 		location: userAddress.location,
				// 		useraddress: userAddress.useraddress,
				// 		status: userAddress.status,
				// 		label: userAddress.label
				// 	})
				// 	.then(res => {
				// 		console.log(res, '地址编辑');
				// 		if (res.data.code == 200) {
				// 			
				// 		}

				// 	})
			} 
		}
	}
</script>

<style lang="less">
	.box {
		height: 800px;
		background-color: #dedede;

		.top {
			background-color: #fff;
			margin-bottom: 15px;
			padding: 10px;
			box-sizing: border-box;
		}

		.bottom {
			height: 440px;
			background-color: #fff;
			padding: 20px 10px;
			box-sizing: border-box;

			.bot_1 {
				display: flex;
				margin-bottom: 30px;

				text {
					margin-right: 30px;
				}
			}

			.bot_2 {
				display: flex;
				justify-content: space-between;
				align-items: flex-end;

				.bot_2_top {
					margin-bottom: 15px;
				}
			}

			.button {
				margin-bottom: 10px;
			}
		}
	}
</style>
